@import "~antd/dist/antd.css";
@import "./styles/markdown.css";
@import "./styles/prism.css";
@import "animate.css";
#root {
  width: 100%;
  height: 100%;
}
body {
  background: var(--g-theme-black) !important;
}

:root {
  --shadow: 50px 50px 100px 10px rgba(0, 0, 0, 0.1);
  --card-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
  --border-in-light: 1px solid #dedede;
  --window-width: 90vw;
  --window-height: 85vh;
  --sidebar-width: 300px;
  --window-content-width: calc(100% - var(--sidebar-width));
  --message-max-width: 80%;

  // 黑色
  body[theme-mode="dark"] {
    // 全局样式
    // 背景颜色
    --g-theme-black: #131829;
    // 菜单背景颜色
    --g-theme-menuBg: #1f2434;
    // --g-theme-menuBg: rgba(255, 255, 255, 0.05);
    // 文字颜色
    --g-theme-color: #fff;
    // 菜单选中颜色
    --g-theme-activeMenuBg: #454545;

    // 会话背景颜色
    --g-theme-sessionBgColor: #131829;
    // 高亮
    --primary: #2196f3;

    // mj 导航未选中颜色
    --g-theme-mj-navNoActive: #fff;

    // 对话框模型提示语颜色
    --g-theme-chat-session-info-color: #63e2b7;

    // 黄色
    --g-theme-mj-btn: #f9ce0c;

    //边框颜色
    --g-theme-bordercolor: #165996;

    // 商品列表

    // 容器背景颜色
    --g-theme-shop-bg: url("../public/assets/imgs/shopDarkBg.svg");

    // 容器边框颜色
    --g-theme-shop-boder-color: rgb(49, 45, 45);

    // 标题背景
    --g-theme-shop-title-bg: url("../public/assets/imgs/shopDarkTitleBg.svg");

    // 标题字体颜色
    --g-theme-title-color: #f4e8d8;

    // 会员卡背景  激活状态
    --g-theme-shop-active-card-bg: url("../public/assets/imgs/shopDarkActiveCardBg.svg");
    // 会员卡背景普通 未激活
    --g-theme-shop-custom-card-bg: url("../public/assets/imgs/shopDarkCustomCardBg.svg");

    // 会员卡信息展示背景
    --g-theme-shop-info-card-bg: linear-gradient(
      to right,
      #695e52 10%,
      #606269
    );

    // 移动端商城模块背景颜色
    --g-theme-mobile-shop-bg: #1f2434;

    // 会员卡标题字体颜色
    --g-theme-card-title-color: #fff8f0;

    // 会员卡价格字体颜色 老
    --g-theme-shop-card-oldPrice: #fff;
    // 会员卡价格字体颜色 新
    --g-theme-shop-card-newPrice: #d1b085;

    // 尊享权益未选中字体颜色
    --g-theme-desc-custom-color: #ffffffa3;

    // 尊享权益选中字体颜色
    --g-theme-desc-active-color: #fff;

    // dalle3 选中颜色
    --g-theme-dalle3-active-color:#fff;

    // qianfan 选中颜色
    --g-theme-qianfan-active-color:#fff;
  }

  // 白色
  body[theme-mode="light"] {
    // 全局样式
    // 背景颜色
    --g-theme-black: #f2f2ff;
    // 菜单背景颜色
    --g-theme-menuBg: #fff;
    // --g-theme-menuBg: rgba(255, 255, 255, 0.05);
    // 文字颜色
    --g-theme-color: #000;
    // 菜单选中颜色
    --g-theme-activeMenuBg: #efeffc;

    // 会话背景颜色
    --g-theme-sessionBgColor: #efeffc;
    // 高亮
    --primary: #2196f3;
    // mj 导航未选中颜色
    --g-theme-mj-navNoActive: #000;
    // 对话框模型提示语颜色
    --g-theme-chat-session-info-color: #63e2b7;
    // 黄色
    --g-theme-mj-btn: #f9ce0c;
    //边框颜色
    --g-theme-bordercolor: #d9d9d9;

    // 闪动样式
    --g-theme-shakeLight: linear-gradient(
      120deg,
      #efeffc 30%,
      #efeffc 38%,
      #f8d84943 40%,
      #f8d84943 46%,
      #efeffc 48%
    );

    // 商品列表
    // 容器背景颜色
    --g-theme-shop-bg: #fff;

    // 容器边框颜色
    --g-theme-shop-boder-color: rgba(0, 0, 0, 0.06);

    // 标题背景
    --g-theme-shop-title-bg: linear-gradient(
      96.27deg,
      #ffeec3 3.33%,
      #ffdbb0 45.52%,
      #ffc196 85.13%,
      #f8a2e6 109.28%
    );

    // 移动端商城模块背景颜色
    --g-theme-mobile-shop-bg: #fff;

    // 标题字体颜色
    --g-theme-title-color: #a21e05;

    // 会员卡背景  激活状态
    --g-theme-shop-active-card-bg: linear-gradient(
      106.29deg,
      rgba(255, 221, 134, 0.5) 0.17%,
      rgba(255, 204, 127, 0.5) 98.78%
    );
    // 会员卡背景普通 未激活
    --g-theme-shop-custom-card-bg: #efeffc;

    // 会员卡信息展示背景
    --g-theme-shop-info-card-bg: rgba(255, 204, 127, 1);

    // 会员卡标题颜色
    --g-theme-card-title-color: #000;

    // 会员卡价格颜色 老
    --g-theme-shop-card-oldPrice: #999;
    // 会员卡价格颜色 新
    --g-theme-shop-card-newPrice: #ac4500;

    // 尊享权益未选中字体颜色
    --g-theme-desc-custom-color: #666;

    // 尊享权益选中字体颜色
    --g-theme-desc-active-color: #333;
    
    --g-theme-dalle3-active-color: #2196f3;
  }
}

div::-webkit-scrollbar {
  width: 4px;
}
div::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  opacity: 0.2;
  background: fade(@primary-color, 60%);
}
div::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 0;
}

// 全局消息背景颜色
.global_message {
  .ant-message-notice-content {
    background: #38383f;
    color: #f8d849;
  }
}
.App {
  width: 100%;
  height: 100%;

  .LayoutContent {
    padding: 10px;
    box-sizing: border-box;
    @media only screen and (max-width: 600px) {
      padding: 0px;
    }
  }

  .LayoutContent {
    width: 100%;
    height: calc(100% - 64px);
    .layout-content_warp {
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: space-between;
      @media only screen and (max-width: 600px) {
        justify-content: center;
        flex-direction: column;
      }

      .layout-content-router {
        width: 100%;
        height: 100%;

        @media only screen and (max-width: 600px) {
          height: calc(100% - 60px);
        }
      }
      .mobile_bottom-tabBar {
        width: 100%;
        height: 55px;
        background: var(--g-theme-menuBg);
        color: var(--g-theme-color);
        display: none;

        border-top: 1px solid var(--g-theme-bordercolor);
        @media only screen and (max-width: 600px) {
          display: grid;
          grid-template-columns: repeat(5, minmax(0px, 1fr));
          gap: 10px;

          .tabBar_item-img {
            width: 25px;
            height: 25px;
            display: block;
            margin: 0 auto;
            margin-top: 5px;
          }
          .tabBar_item-name {
            display: block;
            width: 100%;
            text-align: center;
            text-overflow: ellipsis;
            width: 100%;
            white-space: nowrap;
            overflow: hidden;
          }
        }

        .mobile_bottom_tabBar-select {
          background: var(--g-theme-activeMenuBg);
        }
      }
    }
  }

  .ant-layout {
    width: 100%;
    height: 100% !important;
    background: var(--g-theme-black) !important;
    .ant-layout-content {
      width: 100%;
      height: 100%;
    }
  }

  .warp {
    width: 50%;
    margin: 0 auto;
    overflow: auto;
  }

  #map {
    width: 100%;
    height: 500px;
  }
}
